﻿html { height: 100%; width: 100%;}
body { margin:0px; padding:0px;  font-family:"微软雅黑"; -webkit-user-select:none;word-wrap:break-word;word-break:break-all; width:100%; height:100%; overflow: hidden; }
ul,li { margin:0px; padding:0px; list-style:none;}
img { border:0px;}
.c { clear:both;}
a.clickBtn { padding:0 40px;height:55px; line-height:50px; display:inline-block; text-align:center; margin:auto; font-size:30px; cursor:pointer; margin-top:5px; z-index:9999; border-radius:4px;}
a.middleBtn { padding:0 15px;font-size:20px; height:40px; line-height:40px;}
#main { width:1024px; height:768px; position:relative; margin:auto;}
.module { position:absolute; top:85px; left:0; right:0;height:535px; display:none;}
.closeBtn { position:absolute; height:30px; width:30px; right:0; top:0; z-index:9999; color:#afafaf; font-size:20px; font-family:Arial, Helvetica, sans-serif; line-height:30px; text-align:center; cursor:pointer;}
span.title { font-size:24px; padding:0 180px 0 30px; height: 50px; line-height: 50px; display:block; background: rgba(0,0,0,0.5); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a {text-decoration:none; cursor:pointer; outline:none; transition:all 0.5s;-moz-transition:all 0.5s; /* Firefox 4 */-webkit-transition:all 0.5s; /* Safari and Chrome */-o-transition:all 0.5s; /* Opera */}
#canvas { position: fixed; top: 0; left: 0; z-index: 9999; opacity: 0.8;}
/*字体图标引用*/
@font-face {
    font-family: 'iconfont';  /* project id："21549" */
    src: url('//at.alicdn.com/t/font_pctgsujh2bysc3di.eot');
    src: url('//at.alicdn.com/t/font_pctgsujh2bysc3di.eot?#iefix') format('embedded-opentype'),
    url('//at.alicdn.com/t/font_pctgsujh2bysc3di.woff') format('woff'),
    url('//at.alicdn.com/t/font_pctgsujh2bysc3di.ttf') format('truetype'),
    url('//at.alicdn.com/t/font_pctgsujh2bysc3di.svg#iconfont') format('svg');
}


.iconfont{font-family:"iconfont" !important;font-size:16px;font-style:normal;-webkit-font-smoothing: antialiased;-webkit-text-stroke-width: 0.2px;-moz-osx-font-smoothing: grayscale;}
.light { position:absolute; left:50%; margin-left:-530px; top:50%; margin-top:-530px; background:url(light.png) no-repeat; background-size:100%;  width:1060px; height:1060px;-webkit-animation: lightRotate 5s linear infinite; z-index: 9999;}
@-webkit-keyframes lightRotate {
0% { -webkit-transform: rotateZ(0deg); }
100% { -webkit-transform: rotateZ(360deg);}
}
a.btn { display:inline-block; padding:6px 20px;  border-radius:5px;}
a.arrow { position:absolute; display:block; width:40px; height:40px; top:50%; margin-top:-20px; opacity:0.5;}
a.arrow i { font-size:25px;}
a.left { left:0px;}
a.right { right:-10px;}
a.arrow:hover { opacity:1;}
.description { height:100%;}
.animate-bg { position: fixed; z-index: 9999; top: 0; width: 100%; bottom: 0;}
i { font-style:normal;}
h1,h2,h3 { font-weight:normal;}
a.reclick,a.submitUser {background: -webkit-gradient(linear, 0 0, 0 100%, from(#1e7e05), to(rgb(19,101,5)));display:block; width:122px; height:42px; line-height:40px; color:#fff; font-size:18px; text-align:center; left:50%; margin-left:-135px; cursor:pointer; position:absolute; bottom:40px; font-size:24px;}
a.submitUser { margin-left:20px;}
a.reclick:hover,a.submitUser:hover {background: -webkit-gradient(linear, 0 0, 0 100%, from(#259c05), to(rgb(8,127,0)));}
a.gray { border-radius:3px; background: #b3b3b3;}
a.gray:hover { border-radius:3px; background: #b3b3b3;}

.blackbg { background:#000; opacity:0.8; position:fixed; height:100%; width:100%; top:0; bottom:0; left:0; right:0; z-index:9999;}
/*操作提示*/
.info-box { position:fixed; top:40%; margin-top:-15px; text-align:center; z-index: 99999; width: 100%;}
.error {  height:50px; line-height:50px; font-size: 20px; color:#fd5353; background:#ffe4e4; border-radius:5px; padding: 0 20px; margin: auto; display: inline-block;}
.success {height:50px; line-height:50px; font-size: 20px; color:#32a523; background:#ddffd8; border-radius:5px; padding: 0 20px; margin: auto; display: inline-block;}

/*自定义表情*/
.myface { position:absolute; left:50%; margin-left:-500px; top:0px; z-index:99999; width:1000px; height:1000px;}
.myname { position:absolute; left:50%; margin-left:-500px; top:1000px; z-index:99999; width:1000px;height:80px; text-align:center; font-size:60px; background:#fff; border:3px solid #000; border-radius:10px; color:#000;}
#loading { position:fixed; top:350px; left:50%; margin-left:-175px; width:350px; height:150px; line-height:10px; z-index:9999999;text-align:center; color:#fff; font-size:30px;}
#loading img { display:block; margin:auto;}
#helper { width:300px; height:300px; position:fixed; z-index:999999; right:-100px; top:300px;}

/*---滚动条默认显示样式--*/
::-webkit-scrollbar-thumb{background-color:#6f6f6f; height:50px; -webkit-border-radius:4px;  }
/*---鼠标点击滚动条显示样式--*/
::-webkit-scrollbar-thumb:hover{ background-color:#525252; height:50px; -webkit-border-radius:4px;  }
/*---滚动条大小--*/
::-webkit-scrollbar{width:8px;  height:8px;  }
/*---滚动框背景样式--*/
::-webkit-scrollbar-track-piece{ background:none; -webkit-border-radius:4px;}
/*select模拟*/
.select { width:150px; padding-left:10px; display:inline-block; position:relative; top:10px; background:#fff;  border-radius:5px; height:32px; font-size:16px; line-height:32px; overflow:hidden; background:url(select.png) right 13px no-repeat; background-color:#fff; text-align:left; color:#383838;}
.select a {color:#383838;}
.select:hover { background-color:#EFEFEF}
.select_option {text-align:left; color:#464646; width:160px; background:#fff; position:absolute;  border-radius:5px; font-size:18px; padding-bottom:5px; padding-top:5px; display:none; z-index:99999; max-height:180px; overflow-y:auto;}
.select_option a { display:block;color:#383838; height:30px; line-height:30px; padding-left:10px;}
.select_option a:hover { background:#E3E3E3; color:#000;}
.select_option a div { float:left;}
.select_option a span { font-size:14px; color:#F00; float:right; margin-right:5px;}
#showLevel,#pro_showLevel{ width:230px;}
#showNumber,#pro_showNumber { width:80px;}
.prize { width:240px;}
.showNumber { width:90px;}

/*****颜色设置****/
body {background-color:#000;color:#fff;}
a { color:#fff;}
a.clickBtn,a.btn { color:#fff; background:#0ea69a;} /*按钮背景色*/
a.clickBtn:hover,a.btn:hover {background:#079287;}
a.stopBtn { background: #ff9000;}
a.stopBtn:hover { background: #ff6c00;}
a.graybg { border-radius:3px; background: #e5e5e5; color: #6f6f6f;}
a.graybg:hover { border-radius:3px; background: #d2d2d2;}
.closeBtn {background:rgba(0,0,0,0.6);}
.closeBtn:hover {background:rgba(0,0,0,1);}
.module,.bgColor { background:rgba(0,0,0,0.5);} /*模块背景色*/
.module[data-modulename=messagewalldanmu] { background: none;}
a.disabled {background:#8b8b8b;}
a.disabled:hover {background:#8b8b8b;}
.title { color:#fff;}
#btn_change li {border:2px solid #ececec;color:#fff;}
#top_notice { color:#fff;}
.description { background:#fff;}
.bgColor1 { height:160px; background:rgba(0,0,0,0.8)}




/*　对对碰*/
.luck_pair .left { width:530px; margin:30px 0 0 30px; float:left; position:relative; background:rgba(0,0,0,0.5); height:478px; text-align:center;}
.luck_pair .right { width:339px; height:485px; float:right;color:#797979; position:relative; background:url(luck_pair_right.png) no-repeat; padding-top:50px; padding-left:40px; padding-right:20px;}
.luck_pair .right div.title { font-size:20px;  float:left; padding-left:10px; color:#797979; height:35px;}
.luck_pair .right div.resultNum { float:right; font-size:14px; padding-right:20px;}
.luck_pair .right div.resultNum span { font-size:20px;}
.luck_pair_title {position:absolute; top:0; left:0; right:0; height:50px; font-size:26px; line-height:50px; padding-left:10px; background:rgba(0,0,0,0.5); text-align:left;}
.luck_pair_title i { font-size:27px; margin-right:5px;}
.luck_pair_title a { font-size:14px; margin-left:93px;}
#luck_user,#pro_luck_user{ width:530px;height:245px;overflow:hidden; position:relative;}
#luck_user div.lucky,#pro_luck_user div.lucky{ width:184px; height:230px; border:5px solid #ffa200; position:absolute; z-index:9999; left:168px;}
#luck_user div.left,#pro_luck_user div.left,#luck_user div.right,#pro_luck_user div.right { width:170px;background:rgba(0,0,0,0.7); position:absolute; left:0px; height:230px; z-index:9999; top:5px; margin:0; padding:0;}
#luck_user div.right,#pro_luck_user div.right { left:auto; right:0;}
#luck_user ul,#pro_luck_user ul { position:relative; left:-20px; padding-top:6px;}
#luck_user li,#pro_luck_user li { float:left; width:190px; overflow:hidden; height:227px;}
#luckIng,#pairIng,#pro_luckIng { bottom:13px; position:absolute; left:135px;}
#luck_user #specialPrize { width: 190px; left: 170px;}
#luck_user #specialPrize li { float: none; height: 250px;}
#showPrize { width:490px; position:absolute; top:50px; left:20px; padding-top:20px; padding-bottom:10px; background:#F0F0F0; border-radius:10px;z-index:99999; color:#333; font-size:40px; display:none;}
#showPrize a { display:block; width:24px; height:24px; border-radius:12px; background:#ff5252; color:#fff; right:-20px; top:-20px; font-size:16px; line-height:20px; position:absolute; text-align:center;}
#showPrize a:hover { background:#ff0000;}
#showPrize span { position:absolute; top:-25px; left:50%; margin-left:-10px; color:#F0F0F0;}
#showPrize img { max-width:450px; max-height:250px; border:1px solid #d7d7d7; display:block; margin:auto; margin-bottom:5px;}
#showPrize .prizeContent { text-align:center;}
.showMyLuck { position: absolute; left: 175px; top:6px; z-index: 8888; width: 190px; height: 250px; text-align: center;}
.showMyLuck img { width: 190px; height: 190px; display: block; margin-bottom: 5px;}
.userList { text-align:center; padding-top:80px; height:230px; font-size:30px; white-space: nowrap; }
.userList img { width:180px; height:180px;}
.result,#pairUl { overflow-y:auto; height:340px; width:336px; position:relative; left:-8px; border-top:1px solid #ccc; margin-top:20px;}
.result li{ font-size:22px; border-bottom:1px solid #e3e3e3; height:54px;  line-height:54px; position:relative; padding-left:132px;text-overflow:ellipsis;overflow:hidden;}
.result li span,#pairUl li span{ display:block; width:20px; line-height:20px; text-align:center; font-size:14px; height:20px; background:#AAAAAA; color:#fff; border-radius:2px; position:absolute; left:15px; top:20px;}
.result li a,#pairUl li a{ position:absolute; width:14px; height:14px; right:15px; top:50%; margin-top:-7px; z-index:9999; color:#999999; border:1px solid #999; border-radius:8px; line-height:12px; font-size:12px; text-align:center; display:none; cursor:pointer;}
.result li:hover a,#pairUl li:hover a{ display:block;}
.result li a:hover{ color:#F00; border:1px solid #F00;}
.result li img{ width:50px; height:50px; position:absolute; left:62px; top:3px;}
.active_num { position:absolute; right:40px; top:50px; display:none;/*aileLiu 隐藏*/}
.active_num span { font-size:20px;}
.condition { text-align:center; padding-top:25px; font-size:20px; margin-bottom: 20px;}
.showLuckUserName { position: absolute; width: 284px; height: 50px; line-height: 50px; background: rgba(0,0,0,0.5); color: #fff; left: 50%; margin-left: -145px; top: 50%; border-radius: 0 0  10px 10px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; z-index: 9999; font-size: 30px; margin-top: -39px; opacity: 0;}
#pairUl li { height:85px; font-size:22px; overflow:hidden; position:relative; padding-left:60px;border-bottom:1px solid #e3e3e3; padding-top:8px;}
#pairUl li span { top:35px;}
.pairUserHead { text-align:center; padding-top:80px; height:243px; font-size:30px;overflow: hidden;}
.pairUserHead img { width:180px; height:180px;}
#pairUl li div { float:left; width:120px;text-align:center;}
#pairUl li div img { display:block; margin:auto; width:50px; height:50px;}
#pair .leftUser { width:200px; float:left; text-align:center; margin-left:40px; height:248px; position:relative; overflow:hidden;}
#pair .rightUser { width:200px; float:left; text-align:center; height:245px; overflow:hidden; position:relative;}
#pair .th span.userInfo { padding-left:90px; width:194px;}
#pair .leftUser div,#pair .rightUser div { position:absolute; top:0; left:0; z-index:9999;}
#pair .rightUser img,#pair .leftUser img { width:194px; height:194px;}
#pair .leftUser img { border:3px solid #ff89b0;}
#pair .rightUser img { border:3px solid #06407c;}
#pair .rightUser ul li,#pair .leftUser ul li{ width:200px; float:left;height: 248px;}
#pair .rightUser ul,#pair .leftUser ul { display:none;}
#pair .rightUser ul,#pair .leftUser ul { position:relative;}
span.heart { width:46px; height:36px; display:block; float:left; position:relative; top:80px; margin-left:6px; margin-right:6px; opacity:0.5;}
span.heart i { font-size:30px;}
.pairgif { position:absolute; z-index:9999; top:260px; width:100px; opacity:0; left:50%; margin-left:-50px}
.pairAnimateBg { text-align:center; font-size:30px; position:absolute; left:50%; margin-left:-500px; top:50%; background: url(pair.png) no-repeat; width:1000px; height:512px; background-size: 100%; opacity:0; z-index:9999;}
.pairAnimateBg1 { text-align:center; font-size:30px; position:absolute; left:50%; margin-left:-500px; top:50%; background: url(pair1.png) no-repeat; width:1000px; height:512px; background-size: 100%; opacity:0; z-index:9999;}
div.pairLeft img,div.pairRight img { width:150px; height:150px; }
div.pairLeft { width:150px; height:150px; display:none; position:absolute; z-index:9999; top:50%; margin-top: -100px; left:50%;margin-left:-100px;}
div.pairRight { width:150px; height:150px; display:none; position:absolute; z-index:9999; top:50%; margin-top: -100px; left:50%; margin-left:-100px;}



/*大转盘*/
#turntable {}
.turntable_submit { position: absolute; right: 20px; bottom: 20px;}
.rotationZz { width: 50px; height: 500px; background: url(turnplate-zz.png) no-repeat; background-size: 100%; position: absolute; left: 0; top: 0; z-index: 9;}
.rotationBg{display:block;width:500px; margin-left:100px;z-index:7777; margin-top:10px; position: relative;}
.transfromwheelcanvas { animation: transfromwheelcanvas 0.3s linear infinite;
    -moz-animation: transfromwheelcanvas 0.3s linear infinite; /* Firefox */
    -webkit-animation: transfromwheelcanvas 0.3s linear infinite; /* Safari 和 Chrome */
    -o-animation: transfromwheelcanvas 0.3s linear infinite;}

@keyframes transfromwheelcanvas {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@-moz-keyframes transfromwheelcanvas /* Firefox */
{
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes transfromwheelcanvas /* Safari 和 Chrome */
{
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@-o-keyframes transfromwheelcanvas /* Opera */
{
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.rotationBg .turnplate{display:block;width:100%;position:relative;background:url(turnplate-bg.png) center center no-repeat; background-size:93%;
    animation: changeBg 1s ease-in-out infinite;
    -moz-animation: changeBg 1s ease-in-out infinite; /* Firefox */
    -webkit-animation: changeBg 1s ease-in-out infinite; /* Safari 和 Chrome */
    -o-animation: changeBg 1s ease-in-out infinite;}

@keyframes changeBg {
    0% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    49% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    50% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
    100% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
}

@-moz-keyframes changeBg /* Firefox */
{
    0% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    49% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    50% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
    100% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
}

@-webkit-keyframes changeBg /* Safari 和 Chrome */
{
    0% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    49% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    50% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
    100% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
}

@-o-keyframes changeBg /* Opera */
{
    0% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    49% {
        background-image:url(turnplate-bg.png);background-size:93%;
    }
    50% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
    100% {
        background-image:url(turnplate-bg-1.png);background-size:93%;
    }
}
.rotationBg .turnplate canvas.item{width:100%;}
.rotationBg .turnplate img.pointer{position:absolute;height:110%;left:0%;top:1.1%; z-index: 9999;}
#rotationUserHead,#isLotteryHead {  width:136px; height:136px; background:none; border-radius:70px; position:absolute; left:50%; z-index:8888; margin-left:-229px; top:50%; margin-top:-76px; overflow: hidden;}
#rotationUserHead img,#isLotteryHead img { width: 136px; height: 136px; border-radius: 70px;}
#rotationUserHead ul { width: 136px; position: absolute; top: 0; left: 0; display: none;}
#rotationUserHead ul li { position: relative; height:136px;}
#isLotteryHead { z-index: 9999; opacity: 1;}
#isLotteryHead span,#rotationUserHead ul li span  { background: rgba(0,0,0,0.5); color: #fff; font-size: 18px; position: absolute; bottom: 0; left: 0; width: 100%; text-align: center; height: 40px; line-height: 35px; overflow: hidden; white-space: nowrap; text-overflow:ellipsis;}
#turntablePrize { text-align: center; color: #fff;  font-size: 30px; width: 100%;  position: absolute;  top: 10%; height: 600px; z-index: 9999;}
#turntablePrize img {  height: 0; margin: auto; display: block; margin-top: 20px; margin-bottom: 20px;}

/*投票*/
.vote-index { width: 980px;}
#vote,#votelottery,#imgvote { overflow:hidden;}
#vote span.info,#votelottery span.info,#imgvote span.info { color:#404040; display:block; padding-left:20px;}
#vote div.num,#votelottery div.num,#imgvote div.num { position:absolute; right:5px; text-align: right; display:block; left:auto; z-index: 8888;}
#vote div.num span,#votelottery div.num span,#imgvote div.num span  { font-size:30px; position:relative; top:5px; display:inline;}
#vote .colorInfo,#votelottery .colorInfo,#imgvote .colorInfo { position:absolute; right:20px; bottom:20px;}
#vote .colorInfo,#votelottery .colorInfo,#imgvote .colorInfo { font-size:14px;}
#vote .colorInfo span,#votelottery .colorInfo span,#imgvote .colorInfo span { display:inline-block; height:12px; width:12px; border-radius:2px; margin-left:8px; margin-right:3px; position:relative; top:1px;}
#vote .colorInfo span.red,#votelottery .colorInfo span.red,#imgvote .colorInfo span.red {background:#e30000;}
#vote .colorInfo span.green,#votelottery .colorInfo span.green,#imgvote .colorInfo span.green {background:#57c300;}
#vote .colorInfo span.blue,#votelottery .colorInfo span.blue ,#imgvote .colorInfo span.blue {background:#0085c3;}
#vote_scroll {height:535px; overflow:hidden;}
#vote_scroll .vote_list { float:left; height:545px; width:980px; position:relative; overflow-x:scroll;}
#vote_scroll .vote_list:after { content: ''; display: block;  border-bottom:8px solid #0486b0; position: absolute; bottom: 70px; width: 100%;}
#vote_scroll .vote-scroll-box { overflow: auto; position: absolute; top: 0; width: 980px; bottom: 5px;}
#vote_scroll .vote_list ul { height:380px; position:relative; top:80px;  }
#vote_scroll .vote_list ul li { position:absolute; left:0; bottom:0; min-width:120px; cursor: pointer;}
#vote_scroll .vote_list ul li span { display:block; text-align:center; width:100%; position:absolute; bottom:-30px; white-space: nowrap; overflow: hidden; text-overflow:ellipsis; font-size: 18px; }
#vote_scroll .vote_list ul li font { display:block; text-align:center; width:100%; position:absolute; bottom:210px;font-size: 18px;}
#vote_scroll .vote_list ul li div.normal { position:absolute; width:40px; left:50%; margin-left:-20px; background:#11bfb5; height:0; bottom:0;}
#vote_scroll .vote_list ul li div.guest { position:absolute; width:40px; left:50%; margin-left:-20px; background:#fedb35; height:0; bottom:0;}
#vote_scroll span.title {display:block; position:absolute; top:0; left:0; right:0;}
.show-vote-fans { position: absolute; top: 0; width: 100%; height: 435px;}
.title-btn { position: absolute; right: 5px; top: 0;}
.vote-fans { width: 100%; height: 485px; overflow: auto;}
.vote-fans:after { content: ''; display: block; clear: both;}
.vote-fans>li { float: left; width: 100px; height: 130px; padding-bottom: 10px; font-size: 16px; margin-left: 20px; margin-top: 20px;}
.vote-fans>li>div { border-radius: 8px; border:2px solid rgba(255,255,255,0.5); box-sizing: border-box; width: 100px; height: 100px; position: relative; overflow: hidden; margin-bottom: 10px;}
.vote-fans>li>div>img { width: 100%; height: 100%;}
.vote-fans>li>span { display: block; overflow: hidden; text-align: center; text-overflow: ellipsis;}
.vote-fans>li>div>span { position: absolute; top: 0; right: 0; width: 40px; height: 40px; background: url(isguest.png) no-repeat; background-size: 100%;}
